@charset "gb2312";
/* CSS Document */

body{background:url(../images/bg1.png) repeat 0 0;color:#666;font-family:Open sans, sans-serif;font-size:13px;line-height:1.7;margin:0;overflow-x: hidden;}
h2{font-weight:400;color:#666;margin:0;}
h2{font-size:22px;font-weight:700;}
p,ul,ol{line-height:140%;text-align:inherit;}
a{color:#0078ff;text-decoration:none;}

.top{background:url(../images/bg3.png) repeat 0 0; width:100%; height: 25px; text-align:right}

header{width:1000px;margin:0 auto;  height:90px;font-size:12px;text-align:left;}
.headl{float:left; margin-top:40px;}
.headr{float:right;margin-top:5px;}
.nav{margin-top:55px;float:right;display:inline;height:44px;width:550px;padding:0;}
.nav ul{list-style:none;list-style-position:outside;position:absolute;}
.nav ul li{float:left;font-family:Open sans, sans-serif;font-size:20px;font-weight:500;padding:0 5px;}
.nav ul li:first-child{padding-left:0;}
.nav ul li a{color:#4a4a4a;display:block;height:40px;line-height:40px;border:2px solid transparent;padding:0 7px; }
.nav ul li.active a,.nav ul li a:hover{border:2px solid #029cdb;background:url(../images/nav-btn.png) repeat-x 0 0;color:#fff; 	}

.content{width:1000px;margin:0 auto;}
div.one-col{overflow:hidden;}
div.separator{border-bottom:1px solid gray;margin-bottom:18px;}
div.one-col div.col{width:100%;}

.wide-col{width:650px;float:left;margin-right:10px;}
.slim-col{width:250px;float:left;margin-right:10px;}
div.col p{font-size:14px;line-height:1.5em;margin-bottom:1.5em;}
footer{background:url(../images/bg2.png) repeat 0 0; width:100%; height: 20px; }
.footer p{text-align:left;font-size:14px;border:0;margin:10px;padding:0;}
.cols{width:1000px;margin:0 auto; float:inherit;}
.cols ul li{display:block;border-bottom:1px dotted #bfbfbf; width:100px;}

.bottomcenter{width:670px;display:inline; color:#fff;}

.bottom{background:url(../images/bg3.png) repeat 0 0; width:100%; height: 50px; }

.slider{ width: 900px; margin:0 auto;}





.gallery{
  width: 100%;
  max-width: 960px;
  min-height: 100vh;
  margin: 2rem auto;
  
  display: -webkit-box;
  
           display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  
  -webkit-flex-wrap: wrap;
      
           -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  
  -webkit-box-pack: center;
  
           -webkit-justify-content: center;
      -ms-flex-pack: center;
          
           justify-content: center;
}


.gallery-item{
  box-shadow: 2px 2px 8px -1px #3498DB;
  width: 300px;
  height: 300px;
  margin: 10px;
  background: #000;
  
                position: relative;
  cursor: pointer;
  overflow: hidden;
}


.gallery-item-image{
  position: absolute;
  width: 100%;
  height: 100%;
  
                      background: lightblue;
  z-index:20;
  -webkit-transition:all .5s ease;
  transition: all .5s ease;
  
                      bottom:0;
  overflow: hidden;
}

.gallery-item:hover 
.gallery-item-image{
  bottom: 80px;
}


.gallery-item-description{
  color:white;
  font-size: .8rem;
  width: 100%;
  height: 80px;
  padding: .5rem .8rem;
  
                            background: #3498DB;
  position: absolute;
  bottom:0;
}
